<!-- 栏目管理 编辑，新增 -->
<template>
  <el-card class="app-container">
    <el-form
      ref="form"
      :model="form"
      :rules="rules"
      label-width="140px"
      label-suffix=":"
    >
      <el-form-item label="栏目名称" prop="name">
        <el-input v-model="form.name" placeholder="请输入栏目名称" />
      </el-form-item>
      <el-form-item label="排序" prop="sort">
        <el-input-number
          v-model="form.sort"
          :min="4"
          label="请输入排序"
        ></el-input-number>
      </el-form-item>
      <el-form-item label="状态" prop="enable">
        <el-switch
          v-model="form.enable"
          active-color="#13ce66"
          inactive-color="#ff4949"
          active-value="YES"
          inactive-value="NO"
          @change="changeStatus($event)"
        >
        </el-switch>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onSubmit">保存</el-button>
        <el-button @click="$router.go(-1)">返回</el-button>
      </el-form-item>
    </el-form>
  </el-card>
</template>
<script>
export default {
  name: "programEdit",
  data() {
    return {
      form: {
        name: null,
        sort: null,
        enable: null,
        institutionId: null,
      },
      rules: {
        name: [{ required: true, message: "请输入栏目名称", trigger: "blur" }],
        sort: [{ required: true, message: "请输入排序", trigger: "blur" }],
        enable: [{ required: true, message: "请选择状态", trigger: "change" }],
      },
    };
  },
  created(){
    this.form = this.$route.params.row;
    console.log('row:',this.form)
  },
  methods: {
    // 根据用户id查询儿童康复救助机构信息
    getInfo() {
      this.API.deleteRecoveryInstitutionById().then((res) => {
        this.form.institutionId = res.data.id;
      });
    },
    onSubmit() {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          this.API.addOrUpdateRecoveryItem({ body: this.form })
            .then((res) => {
              this.success("提交成功!");
              this.$router.go(-1);
            })
            .catch((err) => this.warning(err));
        } else {
          return false;
        }
      });
    },
    // 开关
    changeStatus(e) {
      this.form.enable = e;
    },
  },
  mounted() {
    this.getInfo();
  },

};
</script>
  <style scoped lang="scss">
.app-container {
  padding-top: 20px;
  padding-right: 50px;

  .el-input {
    width: 400px;
  }

  .el-select {
    width: 300px;
  }
}
</style>
  